<template>
    <div>
        <el-upload 
            class="upload-demo"
            action="action"
            accept="image/jpeg,image/png,image/jpg"
            :limit="1"
            :auto-upload="true"
            :http-request="uploadFile"
            ref="upload"
            multiple 
            >
            <el-button type="primary" size="small">点击上传</el-button>
            <div slot="tip" class="el-upload__tip">只能上传图片</div>
        </el-upload>
    </div>
</template>

<script>
import {  reqUpLoadImg } from '../../api'
export default {
    prop:['type'],
    methods: {
        //上传图片
        async uploadFile(){
            const formData = new FormData()
            const file = this.$refs.upload.uploadFiles[0]
            const headerConfig = {headers:{'Content-type':'multipart/form-data'}}
            if(!file){
                alert('请选择文件')
                return
            }
            formData.append('file',file.raw)
            formData.append('type',this.type)
            let result  = await reqUpLoadImg(formData,headerConfig)
            this.$emit('getImgUrl',result.data.imgurl) 
        },
    },
}
</script>